<template>

  <div class="person">
    <div class="personIn">
      <h2 style="color: #F56C6C;text-align: center;margin-bottom: 20px">个人信息</h2>
      <el-form s ref="form" :model="form" label-width="80px">
        <el-form-item label="ID">
          <el-input :disabled="true" style="width: 70%" v-model="form.id"></el-input>
        </el-form-item>

        <el-form-item label="用户名">
          <el-input :disabled="true" style="width: 70%" v-model="form.username"></el-input>
        </el-form-item>

        <el-form-item label="昵称">
          <el-input style="width: 70%" v-model="form.nickName"></el-input>
        </el-form-item>

        <el-form-item label="年龄">
          <el-input type="Number" style="width: 70%" v-model="form.age"></el-input>
        </el-form-item>

        <el-form-item label="密码">
          <el-input type="password" style="width: 70%" v-model="form.password"></el-input>
        </el-form-item>

        <el-form-item label="性别">
          <el-radio v-model="form.sex" label="男">男</el-radio>
          <el-radio v-model="form.sex" label="女">女</el-radio>
          <el-radio v-model="form.sex" label="未知">未知</el-radio>
        </el-form-item>

        <el-form-item label="地址">
          <el-input type="textarea" v-model="form.address" style="width: 70%"></el-input>
        </el-form-item>

        <el-button style="margin:0 180px;width: 20%" type="primary" @click="save">保 存</el-button>
      </el-form>


    </div>

  </div>


</template>

<script>
import request from "../unitls/request";

export default {
  name: "Person",
  created() {
    this.form=JSON.parse(sessionStorage.getItem("user"));


   /* const load = () => {
      let username = JSON.parse(sessionStorage.getItem("username"))
      request.get('/api/user/person', {
        params: {
          username: username
        }
      }).then(success => {
        this.form = success.data;
      })
    };
    load();*/
  },
  methods: {
    save() {
      request.put("/api/user", this.form).then(success => {
        if (success.code === '0') {
          this.$notify({
            title: '更新成功',
            message: success.data + '更新成功！',
            type: 'success'

          });
        } else {
          this.$notify({
            title: '更新失败',
            message: success.msg,
            type: 'error'

          });
        }
      })
    }
  },
  data() {
    return {
      form: {}
    }
  }
}
</script>

<style scoped>


.person {
  padding: 10px;
}

.personIn {
  width: 500px;
  height: 100vh;
  margin: 20px auto 0;
}
</style>
